@extends('admin.layouts.app')
@section('css')
    <link rel="stylesheet" href="https://cache.amap.com/lbs/static/main1119.css"/>
     <script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.10&key=c5dac0d4761d48c299d7d86a9a84458b&plugin=AMap.Autocomplete,AMap.PlaceSearch">
     </script>
      <script type="text/javascript" src="https://cache.amap.com/lbs/static/addToolbar.js"></script>

@endsection
@section('content')

                        <!-- Page-Title -->
                        <div class="row">
                            <div class="col-sm-12">
                                <h4 class="page-title">服务区管理</h4>
                                <ol class="breadcrumb">
                                    <li><a href="#">系统</a></li>
                                    <li><a href="#">系统设置</a></li>
                                    <li class="active">添加服务区</li>
                                </ol>
                            </div>
                        </div>
                        
                        <div class="row">
                        	<div class="col-lg-12">
                        		<div class="card-box">
                            <h2 class="m-t-0 header-title">添加服务区</h2>
                            <hr/>
                             @if(session('rs'))
                              <div class="alert alert-{{session('rs')['status']}}">
                                {{ session('rs')['msg'] }}
                              </div>
                              @endif
                        			<div class="row" style="height: 550px">
			                        	<div class="col-md-4">
                                  <form  role="form" action="{{url('zadmin/service-area/save')}}" method="post">

                                            

                                              <div class="form-group">
                                                  <label class="control-label">名称</label>
                                                 
                                                      <input type="text" class="form-control" name="name" required="" value="{{old('name')}}">
                                                
                                              </div>
                                             
                                                  
                                                      
                                                  
                                             
                                              <div class="form-group">
                                                  <label class="control-label">高速</label>
                                                  
                                                      <select  class="form-control select2" name="highway_id" >
                                                        <option value="">请选择</option>
                                                        @foreach($highways as $hw)
                                                        <option value="{{$hw->id}}" {{object_get($pre,'highway_id')==$hw->id?'selected':''}}>{{$hw->name}}</option>
                                                        @endforeach
                                                      </select>
                                                  
                                              </div>
                                              <div class="form-group">
                                                  <label class="control-label">上一服务区</label>
                                                  
                                                      <select  class="form-control" name="prepoint" >
                                                        <option value="">请选择</option>
                                                        @foreach($serviceareas as $area)
                                                        <option value="{{$area->id}}" {{object_get($pre,'id')==$area->id?'selected':''}}>{{$area->name}}</option>
                                                        @endforeach
                                                      </select>
                                                  
                                              </div>

                                              <div class="form-group">
                                                  <label class="control-label">上一服务区距离</label>
                                                  
                                                      <input  class="form-control" name="predist" >
                                                       
                                                 
                                              </div>

                                            
                                                                                                                 
                                              <div class="form-group">
                                                  <label class="control-label">图标</label>
                                                  
                                                      <select  class="form-control select2" name="marker" >
                                                        <option class="">请选择图标颜色</option>
                                                        @foreach($markers as $k=>$v)
                                                        <option value="{{$k}}">{{$v}}</option>
                                                        @endforeach
                                                      </select>
                                                 
                                              </div>

                                              <div class="form-group text-center">
                                                  
                                                  <button type="submit" class="btn btn-info">保存</button>
                                              </div>
                                              
                             <input type="hidden" class="form-control" name="lnglat" id="lnglat" required="" value="{{old('lnglat')}}">                 
                             {{csrf_field()}}
                                          </form>
                                </div>

                                <div class="col-md-8">
                                  <div id="container" style="height: 380px;"></div>
                                    <div id="myPageTop">
                                        <table>
                                            <tr>
                                                <td>
                                                    <label>请输入关键字：</label>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td>
                                                    <input id="tipinput"/>
                                                </td>
                                            </tr>
                                        </table>
                                    </div>                                  
                                </div>

			                        </div>

                             
			                        
                        			
                        		</div>
                                
                            </div> <!-- end col -->

                            
                        </div>
@endsection
                        
                        
                        

                  
            
      
       

           



    
        @section('js')

        <script type="text/javascript">
          //地图加载
          var map = new AMap.Map("container", {
              resizeEnable: true
          });
          //输入提示
          var autoOptions = {
              input: "tipinput"
          };
          var auto = new AMap.Autocomplete(autoOptions);
          var placeSearch = new AMap.PlaceSearch({
              map: map
          });  //构造地点查询类
          AMap.event.addListener(auto, "select", select);//注册监听，当选中某条记录时会触发
          function select(e) {
              placeSearch.setCity(e.poi.adcode);
              placeSearch.search(e.poi.name);  //关键字查询查询
          }

          map.on('click', function(e) {
              document.getElementById("lnglat").value = e.lnglat.getLng() + ',' + e.lnglat.getLat()
          });


        </script>
         

          
       
        @endsection
    
